<template>
  <el-table-column :prop="item.prop" :label="item.label" :width="item.width">
    <template #default="{ row }">
      <a href="javascript:void(0);" @click="handleClick({ handle: item.handle, row })">{{ row[item.prop] }}</a>
    </template>
  </el-table-column>
</template>

<script setup lang="ts">
  import { PropType, toRefs } from 'vue';

  import { ClickColumnType } from '../common-table-type';

  const props = defineProps({
    item: {
      type: Object as PropType<ClickColumnType>,
      default: () => ({}),
    },
  });

  const { item } = toRefs(props);

  // const emits = defineEmits({
  //   handle: null,
  // });

  const handleClick = ({ handle, row }: { handle: (row: any) => void; row: any }) => {
    handle(row);
  };
</script>

<style scoped></style>
